const DATA_FROM_BACKEND = {
    columns: ['date', 'orderCount', 'orderAmount'],
    rows: [
        { date: '2023-03-01', orderCount: 10, orderAmount: 1093 },
        { date: '2023-03-02', orderCount: 20, orderAmount: 2230 },
        { date: '2023-03-03', orderCount: 33, orderAmount: 3623 },
        { date: '2023-03-04', orderCount: 50, orderAmount: 6423 },
        { date: '2023-03-05', orderCount: 80, orderAmount: 8492 },
        { date: '2023-03-06', orderCount: 60, orderAmount: 6293 },
        { date: '2023-03-07', orderCount: 20, orderAmount: 2293 },
        { date: '2023-03-08', orderCount: 60, orderAmount: 6293 },
        { date: '2023-03-09', orderCount: 50, orderAmount: 5293 },
        { date: '2023-03-10', orderCount: 30, orderAmount: 3293 },
        { date: '2023-03-11', orderCount: 20, orderAmount: 2293 },
        { date: '2023-03-12', orderCount: 80, orderAmount: 8293 },
        { date: '2023-03-13', orderCount: 100, orderAmount: 10293 },
        { date: '2023-03-14', orderCount: 10, orderAmount: 1293 },
        { date: '2023-03-15', orderCount: 40, orderAmount: 4293 }
    ]
};
function str2Date(dateStr, separator) {
    if (!separator) {
      separator = "-";
    }
    let dateArr = dateStr.split(separator);
    let year = parseInt(dateArr[0]);
    let month;
    //处理月份为04这样的情况
    if (dateArr[1].indexOf("0") == 0) {
      month = parseInt(dateArr[1].substring(1));
    } else {
      month = parseInt(dateArr[1]);
    }
    let day = parseInt(dateArr[2]);
    let date = new Date(year, month - 1, day);
    return date;
  };

const vue=new Vue({
    el: '#app',
    data:function (){
        return{
        sellLevel: 1,
        admin: "admin",
        visible: false,
        isCollapse: false,
        opened: false,
        isActive: false,
        pickerOptions: {
            shortcuts: [{
                text: '最近一周',
                onClick(picker) {
                    const end = new Date();
                    let start = new Date();
                    start.setFullYear(2023);
                    start.setMonth(3);
                    start.setDate(1);
                    end.setTime(start.getTime() + 3600 * 1000 * 24 * 7);
                    picker.$emit('pick', [start, end]);
                }
            }, {
                text: '最近一月',
                onClick(picker) {
                    const end = new Date();
                    let start = new Date();
                    start.setFullYear(2023);
                    start.setMonth(3);
                    start.setDate(1);
                    end.setTime(start.getTime() + 3600 * 1000 * 24 * 30);
                    picker.$emit('pick', [start, end]);
                }
            }]
        },
        orderCountDate: '',
        chartSettings: {
            xAxisType: 'time',
            area: true,
            axisSite: { right: ['orderAmount'] },
            labelMap: { 'orderCount': '订单数量', 'orderAmount': '订单金额' }
        },
        chartData: {
            columns: ['date', 'orderCount', 'orderAmount'],
            rows: []
        },
        loading: false,
        dataEmpty: false,

    }},
    created() {
        this.initOrderCountDate();
        this.getData();
    },
    
    methods: {
        handleOpen(key, keyPath) {
            console.log(key, keyPath);
        },
        handleClose(key, keyPath) {
            console.log(key, keyPath);
        },
        sidebarHide() {
            $(".sidebar-container").addClass("sidebar-hide");
            alert("sidebarHide");
        },
        sidebarOpen() {
            $(".sidebar-container").removeClass("sidebar-hide");
            alert("sidebarOpen");
        },
        toggleSideBar() {
            alert("togglesidebar");
        },
        sideBar() {
            alert("sidebar");
        },
        toggleClick() {
            this.isActive = !this.isActive;
            this.isCollapse = !this.isCollapse;
        },
        handleCommand(command) {
            window.location.href = "/home";
        },
        logout() {

        },
        handleDateChange() {
            this.getData();
        },
        initOrderCountDate() {
            let start = new Date();
            start.setFullYear(2023);
            start.setMonth(2);
            start.setDate(1);
            const end = new Date();
            end.setTime(start.getTime() + 1000 * 60 * 60 * 24 * 7);
            this.orderCountDate = [start, end];
        },
        getData() {
            setTimeout(() => {
                // this.chartData = {
                //     columns: ['date', 'orderCount', 'orderAmount'],
                //     rows: []
                // };
                // for (let i = 0; i < DATA_FROM_BACKEND.rows.length; i++) {
                //     let item = DATA_FROM_BACKEND.rows[i];
                //     let currDate = str2Date(item.date);
                //     let start = this.orderCountDate[0];
                //     let end = this.orderCountDate[1];
                //     if (currDate.getTime() >= start.getTime() && currDate.getTime() <= end.getTime()) {
                //         this.chartData.rows.push(item);
                //     }
                // }
                // this.dataEmpty = false;
                // this.loading = false
                let start = this.orderCountDate[0];
                let end = this.orderCountDate[1];
                this.chartData.rows=JSON.parse(JSON.stringify(tempList)).filter(val=>{
                    let date=str2Date(val.date);
                    return date.getTime()>=start.getTime()&&date.getTime()<=end.getTime();
                });
            }, 1000)
        }
    }
},
)
function setList(tpList){
    tempList=JSON.parse(JSON.stringify(tpList));
    vue.getData();
}